<template>
  <el-dialog
    ref="refConfirmDlg"
    title="设计申请确认"
    :visible.sync="dialogShow"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    :before-close="closeDialog"
    width="600px"
    :modal-append-to-body="false"
    @close="closeDialog"
  >
    <div>
      <el-form
        ref="refConfirmForm"
        :model="confirmForm"
        :rules="ruleConfirmForm"
        label-width="135px"
      >
        <el-row>
          <el-col>
            <el-form-item label="门店建设项目号:">
              <el-tooltip class="item" effect="dark" content="查看详情" placement="top">
                <el-link class="btn-green" :underline="false" @click="handleDetail">{{ current.constCode }}</el-link>
              </el-tooltip>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>

          <el-col>
            <el-form-item label="所属门店:">
              {{ current.shopName }}
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="确认结果:" prop="confirmResult">
              <el-select
                v-model="confirmForm.confirmResult"
                style="width:200px"
                placeholder="请选择"
                size="mini"
                clearable
              >
                <el-option
                  v-for="item in confirmOption"
                  :key="item.dictCode"
                  :label="item.dictName"
                  :value="item.dictCode"
                />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item>
              <template #label>
                <i style="color:red;font-size:16px" class=" el-icon-warning" />
              </template>
              <span style="color:#999">本人对报图信息的真实有效负责，并同意在出图后15天内进场装修，如有虚假或未按时完成本人自愿承担设计费用。</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="确认意见" prop="confirmAdvice">
          <el-input v-model="confirmForm.confirmAdvice" maxlength="1000" show-word-limit type="textarea" />
        </el-form-item>
      </el-form>
    </div>
    <div slot="footer">
      <el-button size="mini" @click="closeDialog">取消</el-button>
      <el-button size="mini" :loading="confirmLoading" type="primary" @click="submitConfirm">确定</el-button>
    </div>
  </el-dialog>
</template>

<script>
import { getBusinessAccount } from '@/api/common'
import { nowTime } from '@/utils/tool'
import { getDictByPatchType } from '@/api/dataDict'
import { saveConfirm } from '@/api/shopDesign'
export default {
  name: 'ConfirmDesignForm',
  props: {
    visible: {
      type: Boolean,
      default: false,
      required: true
    },
    current: {
      type: [String, Object],
      default: () => {}
    }
  },
  data() {
    return {
      confirmLoading: false,
      confirmOption: [],
      businessAccountList: [], // 业务账号
      confirmForm: {
        id: '',
        confirmAdvice: '', // 确认意见
        confirmTime: '', // 确认时间
        confirmBy: '', // 确认人
        confirmResult: ''// 确认结果
      }, // 提交表单
      ruleConfirmForm: {
        confirmResult: [{ required: true, message: '请选择确认结果', trigger: 'change' }],
        confirmAdvice: [{ required: false, message: '请填写确认意见', trigger: 'change' }]
      }
    }
  },
  computed: {
    dialogShow: {
      get() {
        return this.visible
      },
      set(val) {
        this.$emit('update:visible', val)
      }
    }
  },
  watch: {
    'confirmForm.confirmResult': {
      handler(v) {
        if (v === '0') this.ruleConfirmForm.confirmAdvice[0].required = true
        else if (v === '1') this.ruleConfirmForm.confirmAdvice[0].required = false
      },
      deep: true,
      immediate: true
    }
  },
  async created() {
    const { REVIEW_RESULT } = await getDictByPatchType(['REVIEW_RESULT'])
    this.confirmOption = REVIEW_RESULT
  },

  methods: {
    handleDetail() {
      this.$router.push({ name: 'DesignDetail', query: { id: this.current.id }})
    },
    closeDialog() {
      this.dialogShow = false
      this.clearForm()
    },
    clearForm(done) {
      this.confirmForm = {
        id: '',
        confirmAdvice: '', // 确认意见
        confirmTime: '', // 确认时间
        confirmBy: '', // 确认人
        confirmResult: ''// 确认结果
      } // 提交表单
      this.confirmLoading = false
      this.$refs.refConfirmForm.resetFields()
    },
    // 提交表单处理
    // 确认
    async  submitConfirm() {
      const pass = await this.$refs['refConfirmForm'].validate()
      if (!pass) return
      this.confirmLoading = true
      await getBusinessAccount(this.current.clientCode, 'shopdesign').then(res => {
        if (res.success === 1 && res.data.records.length > 0) {
          res.data.records.map(el => {
            this.businessAccountList.push({
              businessAccountCode: el.code,
              businessAccountName: el.name,
              businessAccountType: el.accountTypeName
            })
          })
        }
      })
      const upData = {
        id: this.current.id,
        businessAccountList1: this.businessAccountList,
        confirmAdvice: this.confirmForm.confirmAdvice, // 确认意见
        confirmTime: nowTime(), // 确认时间
        confirmBy: this.$store.getters.user.data.account || '', // 确认人
        // confirmBy: 'zhengqi', // 确认人
        confirmResult: this.confirmForm.confirmResult// 确认结果
      }
      saveConfirm(upData).then(res => {
        if (res.success === 1) {
          this.$message.success('设计申请确认成功')
          this.$emit('on-success', true)
          this.closeDialog()
          this.confirmLoading = false
        }
      }).catch(() => {
        this.confirmLoading = false
        this.closeDialog()
      })
    }
  }
}
</script>
<style lang='scss' scoped>
</style>
